/*
 *  PAGE: CASE STUDY
 *  What we do pages
 *
 */

.page-case-study {
  min-height: 100vh;

  .single-column.intro .content{
    text-align: center;
  }

  .single-column.intro {
    hr {
      background: transparent !important;
    }
  }

  .single-column + .video {
    // max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }

  .page-content-wrapper {
    @media screen and (min-width: $bp-huge) {
      & > img:not(:first-of-type),
      & > .video {
        max-width: $post-max-width;
        margin: 0 auto;
      }
    }
  }
}


.page-case-study .single-column {
  &.intro {
    padding: 118px 6.25% 55px;
  }

  @media screen and (min-width: $bp-small) {
    &.intro {
      padding: 168px 6.25% 100px;
    }
  }

  @media screen and (min-width: $bp-medium) {
    &.intro {
      padding: 168px 6.25% 100px;
    }
  }
  @media screen and (min-width: $bp-large) {
    &.intro {
      padding: 120px 6.25% 100px;
    }
  }
  @media screen and (min-width: $bp-large) {
    &.intro {
      padding: 120px 6.25% 100px;
    }
  }
}


// The following is a quick hack to make ustwo auto look nice before we move it
// out of 'case studies' and into a new 'speciality' component

.page-case-study {
  &.ustwo-auto {
    .single-column.intro {
      position: relative;
      height: 100vh;
      background-color: #9a9c9b;
      display: flex;
      align-items: center;
      background-image: url('/images/auto/auto-hero.jpg');
      background-repeat: no-repeat;
      background-size: cover;
      padding: 0;

      .section-title {
        display: none;
      }

      .wrapper {
        position: relative;
        z-index: 1;
        color: $offWhite;

        h1 {
          display: flex;
          flex-direction: column;
          color: $honey;

          &:before {
            content: "auto"; // match width of the h1 auto title
            max-width: 200px;
            margin: 0 auto;
            background: url(/images/logo-light.svg) no-repeat 0 0;
            background-position: 50%;
            background-size: 113% auto;
            color: transparent;
          }
        }

        hr,
        .content {
          display: none;
        }
      }
    }
  }
}
